<template>
  <aside :class="['aui-sidebar', `aui-sidebar--${store.state.sidebarLayoutSkin}`]">
    <div class="aui-sidebar__inner">
      <el-menu
        :default-active="store.state.sidebarMenuActiveName"
        :collapse="store.state.sidebarFold"
        :unique-opened="true"
        :collapseTransition="false"
        class="aui-sidebar__menu">
        <main-sidebar-sub-menu v-for="menu in sidebarMenuList" :key="menu.id" :menu="menu" />
      </el-menu>
    </div>
  </aside>
</template>

<script setup>
import MainSidebarSubMenu from './main-sidebar-sub-menu.vue'
import {useStore} from "vuex";
import {computed} from "vue";

const store = useStore()
store.commit('setSidebarMenuList', window.SITE_CONFIG['menuList'])
const sidebarMenuList = computed(() => {
  return store.state.sidebarMenuList
})
</script>
